2018.6.5 星期二
mock data
### [构建前端Mock Server的利器/Json-Server]
restful aip: json-server
整合Webpack Dev Server:proxy参数
加上Faker
### [前端如何 Mock 数据]
#### Mock 的方式
前端模拟 API 数据方式有很多。
手动模拟
重写 Ajax
使用 Webpack 代理
#### Mock Server
以上，说的都是如何模拟数据，方便本地开发，但是代理接口请求之后，还需要接受该请求的服务器。
所以一个完整的数据模拟，应该包含 Mock Server。
可以使用的 Mock Server:
apiary: 可以生成文档，但是非个人使用得付费。
RAP: 功能貌似很强大，阿里妈妈MUX团队出品。
json-server: Node 编写，适合前端人员使用，但不能产生文档。
其它：
为什么你需要一个 mock server
你是如何构建 Web 前端 Mock Server 的？
json-server
https://github.com/typicode/json-serve
Tip use modules like Faker, Casual, Chance or JSON Schema Faker.
express/Webpack
express+router
webpack: webpack-dev-server
webpack: webpack-hot-server
proxy
faker.js
https://github.com/marak/Faker.js/
marak.github.io/faker.js/
mock.js
https://github.com/nuysoft/Mock
http://mockjs.com/
http://mockjs.com/0.1/#mock
生成随机数据，拦截 Ajax 请求
puer-mock:
https://github.com/ufologist/puer-mock
fetch api
### 使用 Fetch-MDN
提供了一个 JavaScript接口，用于访问和操纵HTTP管道的部分，例如请求和响应。它还提供了一个全局 fetch()方法，该方法提供了一种简单，合理的方式来跨网络异步获取资源。
这种功能以前是使用 XMLHttpRequest实现的。Fetch提供了一个更好的替代方法，可以很容易地被其他技术使用，例如 Service Workers。Fetch还提供了单个逻辑位置来定义其他HTTP相关概念，例如CORS和HTTP的扩展。
请注意，fetch规范与jQuery.ajax()主要有两种方式的不同，牢记：
当接收到一个代表错误的 HTTP 状态码时，从 fetch()返回的 Promise 不会被标记为 reject， 即使该 HTTP 响应的状态码是 404 或 500。相反，它会将 Promise 状态标记为 resolve （但是会将 resolve 的返回值的 ok 属性设置为 false ），仅当网络故障时或请求被阻止时，才会标记为 reject。
默认情况下，fetch 不会从服务端发送或接收任何 cookies, 如果站点依赖于用户 session，则会导致未经认证的请求（要发送 cookies，必须设置 credentials 选项）。
### /github/fetch
http://github.github.io/fetch/
A window.fetch JavaScript polyfill.
### Body.json()
Body.json()-MDN
Body mixin 的 json() 方法使用一个 Response 流，并将其读取完成。
它返回一个 promise ，解析结果是将文本体解析为 JSON。1
2
3
4
5fetch(`https://cdn.xgqfrms.xyz/json/badges.json`)
.then((response) => response.json())
.then((data) => {
console.log(`data = \n`, data)
});
axios api
https://github.com/axios/axios
Axios 是一个基于 promise 的 HTTP 库，可以用在浏览器和 node.js 中。
Promise based HTTP client for the browser and node.js
Credits
axios is heavily inspired by the $http service provided in Angular. Ultimately axios is an effort to provide a standalone $http-like service for use outside of Angular.
其它方式
jQuery，vue-resource, angularjs-$http,
